<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
function editable(sample) {
  return `<div contenteditable>${sample}</div>`;
}

function testIt(command_name, input, expected, description) {
  selection_test(editable(input), command_name, editable(expected),
                 description);
}

testIt('bold',
      '<b><ul><li><b>^z|</b></li></ul></b>',
      '<ul style><li style>^z|</li></ul>',
      'bold-1 first character');
testIt('bold',
      '<b><ul><li>^abc|</li><li>xyz</li></ul></b>',
      '<ul style><li style>^abc|</li><li style="font-weight: bold;">xyz</li></ul>',
      'bold-2 first word');
testIt('bold',
      '<ul><li>abc</li><li style="font-weight: bold;">^xyz|</li></ul>',
      '<ul><li>abc</li><li style>^xyz|</li></ul>',
      'bold-3 last word');
testIt('bold',
      '<b><ul><li>^abc| xyz</li><li>wxy</li></ul></b>',
      '<ul style><li style>^abc|<b> xyz</b></li><li style="font-weight: bold;">wxy</li></ul>',
      'bold-4 first word');

testIt('italic',
       '<i><ul><li><i>^z|</i></li></ul></i>',
       '<ul style><li style>^z|</li></ul>',
       'italic-1 first character');
testIt('italic',
       '<i><ul><li>^abc|</li><li>xyz</li></ul></i>',
       '<ul style><li style>^abc|</li><li style="font-style: italic;">xyz</li></ul>',
       'italic-2 first word');
testIt('italic',
       '<ul><li>abc</li><li style="font-style: italic;">^xyz|</li></ul>',
       '<ul><li>abc</li><li style>^xyz|</li></ul>',
       'italic-3 last word');
testIt('italic',
       '<i><ul><li>^abc| xyz</li><li>wxy</li></ul></i>',
       '<ul style><li style>^abc|<i> xyz</i></li><li style="font-style: italic;">wxy</li></ul>',
       'italic-4 first word');

testIt('underline',
       '<u><ul><li><u>^z|</u></li></ul></u>',
       '<ul style><li style>^z|</li></ul>',
       'underline-1 first word');
testIt('underline',
       '<u><ul><li>^abc|</li><li>xyz</li></ul></u>',
       '<ul style><li style>^abc|</li><li style="text-decoration-line: underline;">xyz</li></ul>',
       'underline-2 first word');
testIt('underline',
       '<ul><li>abc</li><li style="text-decoration: underline;">^xyz|</li></ul>',
       '<ul><li>abc</li><li style>^xyz|</li></ul>',
       'underline-3 last word');
testIt('underline',
       '<u><ul><li>^abc| xyz</li><li>wxy</li></ul></u>',
       '<ul style><li style>^abc|<u> xyz</u></li><li style="text-decoration-line: underline;">wxy</li></ul>',
       'underline-4 first word');

testIt('strikethrough',
       '<strike><ul><li><strike>^z|</strike></li></ul></strike>',
       '<ul style><li style>^z|</li></ul>',
       'strike-through-1 first word');
testIt('strikethrough',
       '<strike><ul><li>^abc|</li><li>xyz</li></ul></strike>',
       '<ul style><li style>^abc|</li><li style="text-decoration-line: line-through;">xyz</li></ul>',
       'strike-through-2 first word');
testIt('strikethrough',
       '<ul><li>abc</li><li style="text-decoration: line-through;">^xyz|</li></ul>',
       '<ul><li>abc</li><li style>^xyz|</li></ul>',
       'strike-through-3 last word');
testIt('strikethrough',
       '<strike><ul><li>^abc| xyz</li><li>wxy</li></ul></strike>',
       '<ul style><li style>^abc|<strike> xyz</strike></li><li style="text-decoration-line: line-through;">wxy</li></ul>',
       'strike-through-4 first word');
</script>
